// 头部变量
var HomePage=document.querySelector('.Home-page');
var Plate=document.querySelector('.Plate');
var SearchBoxImg=document.querySelector('.Search-box img');
var SearchBoxInp=document.querySelector('.Search-box input');
var News=document.querySelector('#news');
var MessagePage=document.querySelector('.Message-page');
var CloseMessagePage=document.querySelector('.Message-page>div>div>img');
//目录变量
var CatalogueLi=document.querySelectorAll('.Catalogue li');
//内容变量
var Route=document.querySelector('.route');
var PathEnd=document.querySelector('.Path-end');
var PathEnd=document.querySelector('.Path-end');
var keywordImg=document.querySelector('.keyword img');
var keywordInp=document.querySelector('.keyword input');
var SearchBoxSpan1=document.querySelector('.Search-box1>span');
var SearchBoxLi1=document.querySelectorAll('.Search-box1>ul>li');
var SearchBoxSpan2=document.querySelector('.Search-box2>span');
var SearchBoxLi2=document.querySelectorAll('.Search-box2>ul>li');
var SearchBoxSpan3=document.querySelector('.Search-box3>span');
var SearchBoxLi3=document.querySelectorAll('.Search-box3>ul>li');
var SearchBoxSpan4=document.querySelector('.Search-box4>span');
var SearchBoxLi4=document.querySelectorAll('.Search-box4>ul>li');
var Check=document.querySelector('#check');
var Checkbox;
var CheckNumber=0;
var isChecked=false;
var isCheckboxed=[];
//设置变量
var SetUp=document.querySelector('.Contract-content-page>img');
//渲染页面变量
var data=[
    {index:'1',name:'晁文漪1',EmployeeNo:'GH000001',department:'研发部',position:'产品经理',ContractStatus:'生效中',typeOfContract:'劳动合同',ContractNo:'LDHT0001',SigningTimes:'2',SignedOn:'2022-01-02'},
    {index:'2',name:'晁文漪2',EmployeeNo:'GH000002',department:'研发部',position:'产品经理',ContractStatus:'生效中',typeOfContract:'劳动合同',ContractNo:'LDHT0001',SigningTimes:'2',SignedOn:'2022-01-02'},
    {index:'3',name:'晁文漪3',EmployeeNo:'GH000003',department:'研发部',position:'产品经理',ContractStatus:'生效中',typeOfContract:'劳动合同',ContractNo:'LDHT0001',SigningTimes:'2',SignedOn:'2022-01-02'},
    {index:'4',name:'晁文漪4',EmployeeNo:'GH000004',department:'研发部',position:'产品经理',ContractStatus:'生效中',typeOfContract:'劳动合同',ContractNo:'LDHT0001',SigningTimes:'2',SignedOn:'2022-01-02'},
    {index:'5',name:'晁文漪5',EmployeeNo:'GH000005',department:'研发部',position:'产品经理',ContractStatus:'生效中',typeOfContract:'劳动合同',ContractNo:'LDHT0001',SigningTimes:'2',SignedOn:'2022-01-02'},
    {index:'6',name:'晁文漪6',EmployeeNo:'GH000006',department:'研发部',position:'产品经理',ContractStatus:'生效中',typeOfContract:'劳动合同',ContractNo:'LDHT0001',SigningTimes:'2',SignedOn:'2022-01-02'},
    {index:'7',name:'晁文漪7',EmployeeNo:'GH000007',department:'研发部',position:'产品经理',ContractStatus:'生效中',typeOfContract:'实习协议',ContractNo:'LDHT0001',SigningTimes:'2',SignedOn:'2022-01-02'},
    {index:'8',name:'晁文漪8',EmployeeNo:'GH000001',department:'研发部',position:'产品经理',ContractStatus:'生效中',typeOfContract:'实习协议',ContractNo:'LDHT0001',SigningTimes:'2',SignedOn:'2022-01-02'},
    {index:'9',name:'晁文漪9',EmployeeNo:'GH000001',department:'研发部',position:'产品经理',ContractStatus:'生效中',typeOfContract:'实习协议',ContractNo:'LDHT0001',SigningTimes:'2',SignedOn:'2022-01-02'},
    {index:'10',name:'晁文漪10',EmployeeNo:'GH000001',department:'研发部',position:'产品经理',ContractStatus:'生效中',typeOfContract:'实习协议',ContractNo:'LDHT0001',SigningTimes:'2',SignedOn:'2022-01-02'},
    {index:'11',name:'晁文漪11',EmployeeNo:'GH000001',department:'研发部',position:'产品经理',ContractStatus:'生效中',typeOfContract:'实习协议',ContractNo:'LDHT0001',SigningTimes:'2',SignedOn:'2022-01-02'},
    {index:'12',name:'晁文漪12',EmployeeNo:'GH000001',department:'研发部',position:'产品经理',ContractStatus:'生效中',typeOfContract:'实习协议',ContractNo:'LDHT0001',SigningTimes:'2',SignedOn:'2022-01-02'},
    {index:'13',name:'晁文漪',EmployeeNo:'GH000001',department:'研发部',position:'产品经理',ContractStatus:'生效中',typeOfContract:'劳动合同',ContractNo:'LDHT0001',SigningTimes:'2',SignedOn:'2022-01-02'},
    {index:'14',name:'晁文漪',EmployeeNo:'GH000001',department:'研发部',position:'设计师',ContractStatus:'生效中',typeOfContract:'劳动合同',ContractNo:'LDHT0001',SigningTimes:'2',SignedOn:'2022-01-02'},
    {index:'15',name:'晁文漪',EmployeeNo:'GH000001',department:'研发部',position:'设计师',ContractStatus:'生效中',typeOfContract:'劳务合同',ContractNo:'LDHT0001',SigningTimes:'2',SignedOn:'2022-01-02'},
    {index:'16',name:'晁文漪',EmployeeNo:'GH000001',department:'研发部',position:'设计师',ContractStatus:'已终止',typeOfContract:'劳务合同',ContractNo:'LDHT0001',SigningTimes:'2',SignedOn:'2022-01-02'},
    {index:'17',name:'晁文漪',EmployeeNo:'GH000001',department:'产品部',position:'设计师',ContractStatus:'已终止',typeOfContract:'劳务合同',ContractNo:'LDHT0001',SigningTimes:'2',SignedOn:'2022-01-02'},
    {index:'18',name:'晁文漪',EmployeeNo:'GH000001',department:'产品部',position:'产品经理',ContractStatus:'已终止',typeOfContract:'劳务合同',ContractNo:'LDHT0001',SigningTimes:'2',SignedOn:'2022-01-02'},
    {index:'19',name:'晁文漪',EmployeeNo:'GH000001',department:'产品部',position:'产品经理',ContractStatus:'已终止',typeOfContract:'劳务合同',ContractNo:'LDHT0001',SigningTimes:'2',SignedOn:'2022-01-02'},
    {index:'20',name:'晁文漪',EmployeeNo:'GH000001',department:'产品部',position:'产品经理',ContractStatus:'已终止',typeOfContract:'劳务合同',ContractNo:'LDHT0001',SigningTimes:'2',SignedOn:'2022-01-02'},
    {index:'21',name:'晁文漪',EmployeeNo:'GH000001',department:'产品部',position:'设计主管',ContractStatus:'已终止',typeOfContract:'劳动合同',ContractNo:'LDHT0001',SigningTimes:'2',SignedOn:'2022-01-02'},
    {index:'22',name:'晁文漪',EmployeeNo:'GH000001',department:'产品部',position:'设计主管',ContractStatus:'生效中',typeOfContract:'劳动合同',ContractNo:'LDHT0001',SigningTimes:'2',SignedOn:'2022-01-02'},
    {index:'23',name:'晁文漪',EmployeeNo:'GH000001',department:'产品部',position:'设计主管',ContractStatus:'生效中',typeOfContract:'劳动合同',ContractNo:'LDHT0001',SigningTimes:'2',SignedOn:'2022-01-02'},
    {index:'24',name:'晁文漪',EmployeeNo:'GH000001',department:'产品部',position:'设计主管',ContractStatus:'已解除',typeOfContract:'劳动合同',ContractNo:'LDHT0001',SigningTimes:'2',SignedOn:'2022-01-02'},
    {index:'25',name:'晁文漪',EmployeeNo:'GH000001',department:'研发部',position:'设计主管',ContractStatus:'已解除',typeOfContract:'劳动合同',ContractNo:'LDHT0001',SigningTimes:'2',SignedOn:'2022-01-02'},
    {index:'26',name:'晁文漪',EmployeeNo:'GH000001',department:'研发部',position:'产品经理',ContractStatus:'已解除',typeOfContract:'其他',ContractNo:'LDHT0001',SigningTimes:'2',SignedOn:'2022-01-02'},
    {index:'27',name:'晁文漪',EmployeeNo:'GH000001',department:'研发部',position:'产品经理',ContractStatus:'已解除',typeOfContract:'其他',ContractNo:'LDHT0001',SigningTimes:'2',SignedOn:'2022-01-02'},
    {index:'28',name:'晁文漪',EmployeeNo:'GH000001',department:'研发部',position:'产品经理',ContractStatus:'已解除',typeOfContract:'其他',ContractNo:'LDHT0001',SigningTimes:'2',SignedOn:'2022-01-02'},
    {index:'29',name:'晁文漪',EmployeeNo:'GH000001',department:'研发部',position:'产品经理',ContractStatus:'已解除',typeOfContract:'其他',ContractNo:'LDHT0001',SigningTimes:'2',SignedOn:'2022-01-02'},
    {index:'30',name:'晁文漪',EmployeeNo:'GH000001',department:'研发部',position:'产品经理',ContractStatus:'生效中',typeOfContract:'其他',ContractNo:'LDHT0001',SigningTimes:'2',SignedOn:'2022-01-02'},
    {index:'31',name:'晁文漪',EmployeeNo:'GH000001',department:'研发部',position:'前台',ContractStatus:'生效中',typeOfContract:'其他',ContractNo:'LDHT0001',SigningTimes:'2',SignedOn:'2022-01-02'},
    {index:'32',name:'晁文漪',EmployeeNo:'GH000001',department:'研发部',position:'前台',ContractStatus:'生效中',typeOfContract:'劳动合同',ContractNo:'LDHT0001',SigningTimes:'2',SignedOn:'2022-01-02'},
    {index:'33',name:'晁文漪',EmployeeNo:'GH000001',department:'营销部',position:'前台',ContractStatus:'生效中',typeOfContract:'劳动合同',ContractNo:'LDHT0001',SigningTimes:'2',SignedOn:'2022-01-02'},
    {index:'34',name:'晁文漪',EmployeeNo:'GH000001',department:'营销部',position:'前台',ContractStatus:'生效中',typeOfContract:'劳动合同',ContractNo:'LDHT0001',SigningTimes:'2',SignedOn:'2022-01-02'},
    {index:'35',name:'晁文漪',EmployeeNo:'GH000001',department:'营销部',position:'前台',ContractStatus:'生效中',typeOfContract:'劳动合同',ContractNo:'LDHT0001',SigningTimes:'2',SignedOn:'2022-01-02'},
    {index:'36',name:'晁文漪',EmployeeNo:'GH000001',department:'营销部',position:'前台',ContractStatus:'生效中',typeOfContract:'劳动合同',ContractNo:'LDHT0001',SigningTimes:'2',SignedOn:'2022-01-02'},
    {index:'37',name:'晁文漪',EmployeeNo:'GH000001',department:'营销部',position:'产品经理',ContractStatus:'生效中',typeOfContract:'劳动合同',ContractNo:'LDHT0001',SigningTimes:'2',SignedOn:'2022-01-02'},
    {index:'38',name:'晁文漪',EmployeeNo:'GH000001',department:'营销部',position:'产品经理',ContractStatus:'生效中',typeOfContract:'劳动合同',ContractNo:'LDHT0001',SigningTimes:'2',SignedOn:'2022-01-02'},
    {index:'39',name:'晁文漪',EmployeeNo:'GH000001',department:'营销部',position:'产品经理',ContractStatus:'生效中',typeOfContract:'劳动合同',ContractNo:'LDHT0001',SigningTimes:'2',SignedOn:'2022-01-02'},
    {index:'40',name:'晁文漪',EmployeeNo:'GH000001',department:'研发部',position:'产品经理',ContractStatus:'生效中',typeOfContract:'劳动合同',ContractNo:'LDHT0001',SigningTimes:'2',SignedOn:'2022-01-02'},
    {index:'41',name:'晁文漪',EmployeeNo:'GH000001',department:'研发部',position:'产品经理',ContractStatus:'生效中',typeOfContract:'劳动合同',ContractNo:'LDHT0001',SigningTimes:'2',SignedOn:'2022-01-02'},
    {index:'42',name:'晁文漪',EmployeeNo:'GH000001',department:'研发部',position:'产品经理',ContractStatus:'生效中',typeOfContract:'劳动合同',ContractNo:'LDHT0001',SigningTimes:'2',SignedOn:'2022-01-02'},
    {index:'43',name:'晁文漪',EmployeeNo:'GH000001',department:'研发部',position:'产品经理',ContractStatus:'生效中',typeOfContract:'劳动合同',ContractNo:'LDHT0001',SigningTimes:'2',SignedOn:'2022-01-02'},
    {index:'44',name:'晁文漪',EmployeeNo:'GH000001',department:'研发部',position:'产品经理',ContractStatus:'生效中',typeOfContract:'劳动合同',ContractNo:'LDHT0001',SigningTimes:'2',SignedOn:'2022-01-02'},
    {index:'45',name:'晁文漪',EmployeeNo:'GH000001',department:'研发部',position:'产品经理',ContractStatus:'生效中',typeOfContract:'劳动合同',ContractNo:'LDHT0001',SigningTimes:'2',SignedOn:'2022-01-02'},
];
var page=1;
var count=10;
var Tbody=document.querySelector('tbody');
var Pagination=document.querySelector('.pagination');
var FirstBtn=document.querySelector('.first');
var PrevBtn=document.querySelector('.prev');
var NextBtn=document.querySelector('.next');
var LastBtn=document.querySelector('.last');
var TotalNumber=document.querySelector('.Total-number');
//添加变量
var ContractContentPage=document.querySelector('.Contract-content-page')
var AddContractPage=document.querySelector('.Add-contract-page')
var Add=document.querySelector('.add');
var AddPreservation=document.querySelector('.Add-contract-page .preservation')
var AddCancel=document.querySelector('.Add-contract-page .cancel')
//编辑变量
var EditContractPage=document.querySelector('.edit-contract-page');
var EditPreservation=document.querySelector('.edit-contract-page .preservation')
var EditCancel=document.querySelector('.edit-contract-page .cancel')
//续约合同变量
var RenewContractPage=document.querySelector('.Renew-contract-page');
var RenewPreservation=document.querySelector('.Renew-contract-page .preservation')
var RenewCancel=document.querySelector('.Renew-contract-page .cancel')

//设置
SetUp.onmouseenter=function(){
    SetUp.src='../../images/yqy_images/content/content_set_up_mouseOver.png'
}
SetUp.onmouseleave=function(){
    SetUp.src='../../images/yqy_images/content/content_set_up.png'
}

//头部
HomePage.onclick=function(){
    if(HomePage.className!='.active'){
        Plate.classList.remove('active');
        HomePage.classList.add('active');
        $('.plate-type').slideUp('fast');
    }
}
Plate.onclick=function(){
    if(Plate.className!='.active'){
        HomePage.classList.remove('active');
        Plate.classList.add('active')
    }
}
$('.Plate').click(function(){
    $('.plate-type').slideToggle('fast');
})
SearchBoxImg.onmouseenter=function(){
    SearchBoxImg.src='../../images/yqy_images/header/heder_search.png';
}
SearchBoxImg.onmouseleave=function(){
    SearchBoxImg.src='../../images/yqy_images/header/heder_search_mouseOver.png';
}
$('.Header-right div').click(function(){
    $('.personal-information5').slideToggle('fast');
})
News.onclick=function(){
    MessagePage.style.display='block';
}
CloseMessagePage.onclick=function(){
    MessagePage.style.display='none';
}

//目录
for(var i=0;i<CatalogueLi.length;i++){
    CatalogueLi[i].onmouseenter=function(){
        if(this.className==''){
            this.style.background='rgba(26, 107, 232, 0.0470588235294118)';
            this.onclick=function(){
                for(var i=0;i<CatalogueLi.length;i++){
                    this.style.background=''
                    CatalogueLi[i].className='';
                    this.className='active';
                    PathEnd.innerHTML=this.firstElementChild.innerHTML;

                }
            }
        }
    }
    CatalogueLi[i].onmouseleave=function(){
        if(this.className==''){
            this.style.background='';
        }
    }
}
$('.Catalogue div').click(function(){
    $(this).next().slideToggle('fast');
    if($(this).find('p').find('img').get(0).style.transform=='rotate(90deg)'){
        console.log(1);
        $(this).find('p').find('img').css('transform','rotate(180deg)');
    }else{
        console.log(2);
        $(this).find('p').find('img').css('transform','rotate(90deg)');
    }
});

//内容
keywordImg.onmouseenter=function(){
    this.src='../../images/yqy_images/header/heder_search.png';
}
keywordImg.onmouseleave=function(){
    this.src='../../images/yqy_images/content/content_search2.png';
}
$('.Search-box1').click(function(){
    $(this).children('ul').slideToggle();
    event.cancelBubble=true;
});
$('.Search-box1>ul>li').click(function(){
    $(this).parent().prev().prev().text(this.innerHTML);
})
$('.Search-box2').click(function(){
    $(this).children('ul').slideToggle();
    event.cancelBubble=true;
});
$('.Search-box2>ul>li').click(function(){
    $(this).parent().prev().prev().text(this.innerHTML);
})
$('.Search-box3').click(function(){
    $(this).children('ul').slideToggle();
    event.cancelBubble=true;
});
$('.Search-box3>ul>li').click(function(){
    $(this).parent().prev().prev().text(this.innerHTML);
})
$('.Search-box4').click(function(){
    $(this).children('ul').slideToggle();
    event.cancelBubble=true;
});
$('.Search-box4>ul>li').click(function(){
    $(this).parent().prev().prev().text(this.innerHTML);
})
$('#Box').click(function(){
    $('.Search-box1').children('ul').slideUp();
    $('.Search-box2').children('ul').slideUp();
    $('.Search-box3').children('ul').slideUp();
    $('.Search-box4').children('ul').slideUp();
});
function render(){
    var str=SearchBoxSpan1.innerHTML;
    var str2=SearchBoxSpan2.innerHTML;
    var str3=SearchBoxSpan3.innerHTML;
    var str4=SearchBoxSpan4.innerHTML;
    var str5=keywordInp.value;
    var SearchData=[];
    var SearchData2=[];
    var SearchData3=[];
    var SearchData4=[];
    var SearchData5=[];
    if(str=='请选择'){
        SearchData=data;
    }else{
        for(var i=0;i<data.length;i++){
            if(data[i].department==str){
                SearchData.push(data[i]);
            }
        }
    }
    if(str2=='请选择'){
        SearchData2=SearchData;
    }else{
        for(var i=0;i<SearchData.length;i++){
            if(SearchData[i].position==str2){
                SearchData2.push(SearchData[i]);
            }
        }
    }
    if(str3=='请选择'){
        SearchData3=SearchData2;
    }else{
        for(var i=0;i<SearchData2.length;i++){
            if(SearchData2[i].typeOfContract==str3){
                SearchData3.push(SearchData2[i]);
            }
        }
    }
    if(str4=='请选择'){
        SearchData4=SearchData3;
    }else{
        for(var i=0;i<SearchData3.length;i++){
            if(SearchData3[i].ContractStatus==str4){
                SearchData4.push(SearchData3[i]);
            }
        }
    }
    if(str5==''){
        SearchData5=SearchData4;
    }else{
        for(var i=0;i<SearchData4.length;i++){
            for(var key in SearchData4[i]){
                if(SearchData4[i][key].includes(str5)){
                    SearchData5.push(SearchData4[i]);
                    break;
                }
            }
        }
    }
    if(page>Math.ceil(SearchData5.length/count)){
        page=Math.ceil(SearchData5.length/count);
    }
    if(page<1){
        page=1;
    }
    Tbody.innerHTML='';
    var RenderArr=SearchData5.slice((page-1)*count,page*count);
    //总条数
    TotalNumber.innerHTML='共'+SearchData5.length+'条';
//渲染内容
    for(var i=0;i<RenderArr.length;i++){
        var Tr=document.createElement('tr');
        Tr.innerHTML=`
            <td><img class="checkbox" src="../../images/yqy_images/content/content_check.png"></td>
            <td class="Contract-Avatar"><img src="../../images/yqy_images/content/content_头像.png"><span>${RenderArr[i].name}</span></td>
            <td><span>${RenderArr[i].EmployeeNo}</span></td>
            <td><span>黛西进出口贸易公司/</span><span>${RenderArr[i].department}</span></td>
            <td><span>${RenderArr[i].position}</span></td>
            <td><span style="color:#28d094;">${RenderArr[i].ContractStatus}</span></td>
            <td><span>${RenderArr[i].typeOfContract}</span></td>
            <td><span>${RenderArr[i].ContractNo}</span></td>
            <td><span>${RenderArr[i].SigningTimes}</span></td>
            <td><span>${RenderArr[i].SignedOn}</span></td>
            <td><a class="edit">编辑</a><a class="Renew">续签合同</a><a class="del">解除合同</a></td>
        `;
        Tr.index=RenderArr[i].index;
        Tbody.appendChild(Tr);
    }
    Checkbox=document.querySelectorAll('.checkbox');
//渲染分页
    var PageBtn=document.querySelectorAll('.pageBtn');
    for(var i=0;i<PageBtn.length;i++){
        Pagination.removeChild(PageBtn[i].parentNode);
    }
    for(var i=1;i<=Math.ceil(SearchData5.length/count);i++){
        var Li=document.createElement('li');
        Li.innerHTML=`<a class="pageBtn" href="#">${i}</a>`;
        if(i==page){
            Li.classList.add('active');
        };
        Pagination.insertBefore(Li,Pagination.children[Pagination.children.length-2]);
    }
}
render();

//选项
Check.addEventListener('mouseenter',checkEnterFn);
Check.addEventListener('mouseleave',checkLeaveFn);
for(var i=0;i<Checkbox.length;i++){
    Checkbox[i].addEventListener('mouseenter',checkboxEnterFn);
    Checkbox[i].addEventListener('mouseleave',checkboxLeaveFn);
    isCheckboxed.push(false);
    Checkbox[i].index=i;
}
function checkEnterFn(){
    if(isChecked==false){
        this.src='../../images/yqy_images/content/content_check_mouseOver.png';
    }
}
function checkboxEnterFn(){
    if(isCheckboxed[this.index]==false){
        this.src='../../images/yqy_images/content/content_check_mouseOver.png';
    }
}
function checkLeaveFn(){
    if(isChecked==false){
        this.src='../../images/yqy_images/content/content_check.png';
    }
}
function checkboxLeaveFn(){
    if(isCheckboxed[this.index]==false){
        this.src='../../images/yqy_images/content/content_check.png';
    }
}
Check.onclick=function(){
    isChecked=!isChecked;
    if(isChecked){
        Check.src='../../images/yqy_images/content/content_checked.png';
        for(var i=0;i<Checkbox.length;i++){
            isCheckboxed[i]=!isCheckboxed[i];
            Checkbox[i].src='../../images/yqy_images/content/content_checked.png';
            CheckNumber=Checkbox.length;
        }
    }else{
        Check.src='../../images/yqy_images/content/content_check_mouseOver.png';
        for(var i=0;i<Checkbox.length;i++){
            isCheckboxed[i]=!isCheckboxed[i];
            Checkbox[i].src='../../images/yqy_images/content/content_check.png';
            CheckNumber=0;
        }
    }
}
for(var i=0;i<Checkbox.length;i++){
    Checkbox[i].index=i;
    Checkbox[i].onclick=function(){
        isCheckboxed[this.index]=!isCheckboxed[this.index]
        if(isCheckboxed[this.index]){
            this.src='../../images/yqy_images/content/content_checked.png';
            CheckNumber++;
        }else{
            this.src='../../images/yqy_images/content/content_check_mouseOver.png';
            CheckNumber--;
        }
        if(CheckNumber==Checkbox.length){
            isChecked=true;
            Check.src='../../images/yqy_images/content/content_checked.png';
        }else{
            isChecked=false;
            Check.src='../../images/yqy_images/content/content_check.png';
        }
    }
}

Pagination.addEventListener('click',changePage);
function changePage(){
    if(event.target.className=='pageBtn'){
        /* var PageBtn=document.querySelectorAll('.pageBtn');
        for(var i=0;i<PageBtn.length;i++){
            PageBtn[i].parentNode.classList.remove('active');
        }
        event.target.parentNode.classList.add('active'); */
        page=event.target.innerText;
        render();
    }
    /* if(event.target.className=='prev'){
        if(page>1){
            page--;
            render();
        }
    }
    if(event.target.className=='next'){
        if(page<Pagination.children.length-4){
            page++;
            render();
        }
    }
    if(event.target.className=='first'){
        if(page!=1){
            page=1;
            render();
        }
    }
    if(event.target.className=='last'){
        if(page!=Pagination.children.length-4){
            page=Pagination.children.length-4;
            render();
        }
    } */
}
PrevBtn.addEventListener('click',prevFn);
FirstBtn.addEventListener('click',firstFn);
NextBtn.addEventListener('click',nextFn);
LastBtn.addEventListener('click',lastFn);
function prevFn(){
    if(page>1){
        page--;
        render();
    }
}
function firstFn(){
    if(page!=1){
        page=1;
        render();
    }
}
function nextFn(){
    if(page<Pagination.children.length-4){
        page++;
        render();
    }
}
function lastFn(){
    if(page!=Pagination.children.length-4){
        page=Pagination.children.length-4;
        render();
    }
}
Tbody.addEventListener('click',delFn);
function delFn(){
    if(event.target.className.includes('del')){
        var index=event.target.parentNode.parentNode.index;
        for(var i=0;i<data.length;i++){
            if(data[i].index==index){
                data.splice(i,1);
            }
        }
        render();
        return;
    }
}
//搜索
for(var i=0;i<SearchBoxLi1.length;i++){
    SearchBoxLi1[i].addEventListener('click',Search1Fn);
}
function Search1Fn(){
    page=1;
    render();
}
for(var i=0;i<SearchBoxLi2.length;i++){
    SearchBoxLi2[i].addEventListener('click',Search2Fn);
}
function Search2Fn(){
    page=1;
    render();
}
for(var i=0;i<SearchBoxLi3.length;i++){
    SearchBoxLi3[i].addEventListener('click',Search3Fn);
}
function Search3Fn(){
    page=1;
    render();
}
for(var i=0;i<SearchBoxLi4.length;i++){
    SearchBoxLi4[i].addEventListener('click',Search4Fn);
}
function Search4Fn(){
    page=1;
    render();
}
keywordImg.addEventListener('click',Search5Fn);
function Search5Fn(){
    page=1;
    render();
}

//添加
Add.onclick=function(){
    ContractContentPage.style.display='none';
    AddContractPage.style.display='block';
    Route.innerHTML='员工 &gt 员工关系 &gt 合同管理 &gt';
    PathEnd.innerHTML='签订合同';
}
AddCancel.onclick=function(){
    var AddName=document.getElementById('addName').value.trim();
    var AddEmployeeNo=document.getElementById('addEmployeeNo').value.trim();
    var AddDepartment=document.getElementById('addDepartment').value.trim();
    var AddPosition=document.getElementById('addPosition').value.trim();
    var AddContractStatus=document.getElementById('addContractStatus').value.trim();
    var AddTypeOfContract=document.getElementById('addTypeOfContract').value.trim();
    var AddContractNo=document.getElementById('addContractNo').value.trim();
    var AddSigningTimes=document.getElementById('addSigningTimes').value.trim();
    var AddSignedOn=document.getElementById('addSignedOn').value.trim();
    var AddIndex=document.getElementById('addIndex').value.trim();
    ContractContentPage.style.display='block';
    AddContractPage.style.display='none';
    AddName='';
    AddEmployeeNo='';
    AddDepartment='';
    AddPosition='';
    AddContractStatus='';
    AddTypeOfContract='';
    AddContractNo='';
    AddSigningTimes='';
    AddSignedOn='';
    AddIndex=''
    Route.innerHTML='员工 &gt 员工关系 &gt';
    PathEnd.innerHTML='合同管理';
}
AddPreservation.addEventListener('click',AddPreservationFn)
function AddPreservationFn(){
    var AddName=document.getElementById('addName').value.trim();
    var AddEmployeeNo=document.getElementById('addEmployeeNo').value.trim();
    var AddDepartment=document.getElementById('addDepartment').value.trim();
    var AddPosition=document.getElementById('addPosition').value.trim();
    var AddContractStatus=document.getElementById('addContractStatus').value.trim();
    var AddTypeOfContract=document.getElementById('addTypeOfContract').value.trim();
    var AddContractNo=document.getElementById('addContractNo').value.trim();
    var AddSigningTimes=document.getElementById('addSigningTimes').value.trim();
    var AddSignedOn=document.getElementById('addSignedOn').value.trim();
    var AddIndex=document.getElementById('addIndex').value.trim();
    function repeat(){
        for(var i=0;i<data.length;i++){
            if(AddIndex==data[i].index){
                return true;
            }
        }
        return false;
    }
    if(repeat()==false){
        data.push({
            index:AddIndex,
            name:AddName,
            EmployeeNo:AddEmployeeNo,
            department:AddDepartment,
            position:AddPosition,
            ContractStatus:AddContractStatus,
            typeOfContract:AddTypeOfContract,
            ContractNo:AddContractNo,
            SigningTimes:AddSigningTimes,
            SignedOn:AddSignedOn,
        })
        render();
        ContractContentPage.style.display='block';
        AddContractPage.style.display='none';
        AddName='';
        AddEmployeeNo='';
        AddDepartment='';
        AddPosition='';
        AddContractStatus='';
        AddTypeOfContract='';
        AddContractNo='';
        AddSigningTimes='';
        AddSignedOn='';
        AddIndex='';
        Route.innerHTML='员工 &gt 员工关系 &gt';
        PathEnd.innerHTML='合同管理';
    }else{
        alert('index不能重复')
    }
}

//编辑
EditCancel.onclick=function(){
    ContractContentPage.style.display='block';
    EditContractPage.style.display='none';
    Route.innerHTML='员工 &gt 员工关系 &gt';
    PathEnd.innerHTML='合同管理';
}
Tbody.addEventListener('click',openEditFn);
function openEditFn(){
    if(event.target.className.includes('edit')){
        ContractContentPage.style.display='none';
        EditContractPage.style.display='block';
        var index=event.target.parentNode.parentNode.index;
        for(var i=0;i<data.length;i++){
            if(data[i].index==index){
                document.getElementById('editName').value=data[i].name;
                document.getElementById('editEmployeeNo').value=data[i].EmployeeNo;
                document.getElementById('editDepartment').value=data[i].department;
                document.getElementById('editPosition').value=data[i].position;
                document.getElementById('editContractStatus').value=data[i].ContractStatus;
                document.getElementById('editTypeOfContract').value=data[i].typeOfContract;
                document.getElementById('editContractNo').value=data[i].ContractNo;
                document.getElementById('editSigningTimes').value=data[i].SigningTimes;
                document.getElementById('editSignedOn').value=data[i].SignedOn;
                document.getElementById('editIndex').value=data[i].index;
            }
        }
    }
    Route.innerHTML='员工 &gt 员工关系 &gt 合同管理 &gt';
    PathEnd.innerHTML='签订合同';
}
EditPreservation.addEventListener('click',editFn);
function editFn(){
    var index=document.getElementById('editIndex').value;
    for(var i=0;i<data.length;i++){
        if(data[i].index==index){
            data[i].department=document.getElementById('editDepartment').value;
            data[i].position=document.getElementById('editPosition').value;
        }
    }
    render();
    ContractContentPage.style.display='block';
    EditContractPage.style.display='none';
    Route.innerHTML='员工 &gt 员工关系 &gt';
    PathEnd.innerHTML='合同管理';
}

//续约合同
RenewCancel.onclick=function(){
    ContractContentPage.style.display='block';
    RenewContractPage.style.display='none';
    Route.innerHTML='员工 &gt 员工关系 &gt';
        PathEnd.innerHTML='合同管理';
}
Tbody.addEventListener('click',openRenewFn);
function openRenewFn(){
    if(event.target.className.includes('Renew')){
        ContractContentPage.style.display='none';
        RenewContractPage.style.display='block';
        var index=event.target.parentNode.parentNode.index;
        for(var i=0;i<data.length;i++){
            if(data[i].index==index){
                document.getElementById('RenewName').value=data[i].name;
                document.getElementById('RenewEmployeeNo').value=data[i].EmployeeNo;
                document.getElementById('RenewDepartment').value=data[i].department;
                document.getElementById('RenewPosition').value=data[i].position;
                document.getElementById('RenewContractStatus').value=data[i].ContractStatus;
                document.getElementById('RenewTypeOfContract').value=data[i].typeOfContract;
                document.getElementById('RenewContractNo').value=data[i].ContractNo;
                document.getElementById('RenewSigningTimes').value=data[i].SigningTimes;
                document.getElementById('RenewSignedOn').value=data[i].SignedOn;
                document.getElementById('RenewIndex').value=data[i].index;
            }
        }
    }
    Route.innerHTML='员工 &gt 员工关系 &gt 合同管理 &gt';
    PathEnd.innerHTML='续约合同';
}
RenewPreservation.addEventListener('click',RenewFn);
function RenewFn(){
    var index=document.getElementById('RenewIndex').value;
    for(var i=0;i<data.length;i++){
        if(data[i].index==index){
            data[i].typeOfContract=document.getElementById('RenewTypeOfContract').value;
            data[i].ContractNo=document.getElementById('RenewContractNo').value;
            data[i].SigningTimes=document.getElementById('RenewSigningTimes').value;
            data[i].SignedOn=document.getElementById('RenewSignedOn').value;
        }
    }
    render();
    ContractContentPage.style.display='block';
    RenewContractPage.style.display='none';
    Route.innerHTML='员工 &gt 员工关系 &gt';
    PathEnd.innerHTML='合同管理';
}